import React, { Component } from 'react'
import { NavBar, Toast } from 'antd-mobile'
import "./Shop.less"
import { reqCartdelete, reqCartedit, reqCartlist } from '../../http/api'
import no from "../../assets/img/no.png"
import yes from "../../assets/img/yes.png"
export default class Shop extends Component {
    constructor() {
        super()
        // 社初始值
        this.state = {
            goodsinfo: []
        }
    }
    componentDidMount() {
        this.goodsList()
    }
    // 请数据
    goodsList() {
        let uid = JSON.parse(sessionStorage.getItem("info")).uid
        console.log(uid);
        reqCartlist({ uid }).then(res => {
            console.log(res);
            this.setState({
                goodsinfo: res.data.list ? res.data.list[1].content :[]
            })
        })
    }
    // }
    del(id){
        reqCartdelete({id}).then(res=>{
            if(res.data.code===200){
                Toast.success(res.data.msg)
                // 重新渲染列表
                this.goodsList()
            }
        })
    }
    add(id){
        let token=JSON.parse(sessionStorage.getItem("info")).token
        reqCartedit({id,type:2,token}).then(res=>{
           this.goodsList()
        })
    }
    sub(id,num){
        let token=JSON.parse(sessionStorage.getItem("info")).token
        reqCartedit({id,type:1,token}).then(res=>{
            
           this.goodsList()
        //    console.log();
        //    if(num<=1){
        //        Toast("不能再少了")
        //    }
        })
    }
    render() {
        let { goodsinfo } = this.state
        return (
            <div className="home">
                <NavBar>商城</NavBar>
                {/* 渲染数据 */}
                {
                    goodsinfo.map(item => (

                        <div key={item.id} className="item">
                            <div className="check"> <img src={no} alt="" /></div>
                            <img src={item.img} alt="" />


                            <div className="right">
                                <span className="name">{item.goodsname}</span>
                                <span className="price">&yen;{item.price}</span>
                                <div className="num">
                                    <span onClick={()=>this.add(item.id)}>+</span>
                                    <i> {item.num}</i>
                                    <span onClick={()=>this.sub(item.id)}>-</span>
                                    <div  className="button" onClick={()=>this.del(item.id,item.num)}>删除</div>
                                </div>
                            </div>

                        </div>


                    ))
                }
            </div>
        )
    }
}
